			<ul id="mainNav">
				<li <?php if ($activePage == "grid" ) { echo 'class="active"'; } ?>>
					<a href="grid.php">Fluid Grid</a>
					<span>Fluid panels, fixed blocks, columns, centered blocks,...</span>
				</li>
				<li <?php if ($activePage == "gridFix" ) { echo 'class="active"'; } ?>>
					<a href="gridFix.php">Fix Grid</a>
					<span>Same content as fluid panels, but width fixed width</span>
				</li>
				<li <?php if ($activePage == "texts" ) { echo 'class="active"'; } ?>>
					<a href="texts.php">Texts</a>
					<span>Headings, parragraphs, links, lists, ...</span>
				</li>
				<li <?php if ($activePage == "forms" ) { echo 'class="active"'; } ?>>
					<a href="forms.php">Forms</a>
					<span>labels, inputs, dropdowns, textareas, checkbox, radios,...
				</li>
				<li <?php if ($activePage == "buttons" ) { echo 'class="active"'; } ?>>
					<a href="buttons.php">Buttons</a>
					
				</li>
				<li <?php if ($activePage == "dialogs" ) { echo 'class="active"'; } ?>>
					<a href="dialogs.php">Dialogs</a>
					<span>Modal windows</span>
				</li>
				<li <?php if ($activePage == "tabs" ) { echo 'class="active"'; } ?>>
					<a href="tabs.php">Tabs</a>
					<span>Preload tabs & ajax content tabs</span>
				</li>
				<li <?php if ($activePage == "tables" ) { echo 'class="active"'; } ?>>
					<a href="tables.php">Tables</a>
					
				</li>
				<li <?php if ($activePage == "others" ) { echo 'class="active"'; } ?>>
					<a href="others.php">Others</a>
					<span>Breadcrumbs, pagination, tooltips, images, ...</span>
				</li>
			</ul>